import { IMOptionsType } from "@/types/dict";
import { IMTableType } from "@/types/table";
import { auditStatusMap, popularCertStatusMap } from "./dict";
import { DrawerFormStateType, UserFormStateType } from "./type";
import baseStyle from "@layout/header/style/base.module.less";
export const operateType = ref<any>("");
export const colorOptions = reactive<any>({
  0: "s-ffc107",
  1: "s-52c41a",
  2: "s-dc3545",
  3: "s-888888",
  4: "s-ff0088",
  5: "s-ff0000",
});
export const tableActiveKey = ref(0);
export const tabPower = reactive([true, true]);
export const defaultColumns = reactive([
  [
    { title: getProxyT("base.index"), dataIndex: "index", key: "index" },
    {
      title: getProxyT("table0"),
      key: "userInfo",
    },
    {
      title: getProxyT("table6"),
      dataIndex: "popularLevel",
      key: "popularLevel",
    },
    {
      title: getProxyT("table50"),
      dataIndex: "progress",
      key: "progress",
    },
    { title: getProxyT("table51"), dataIndex: "status", key: "status" },
    {
      title: getProxyT("table52"),
      dataIndex: "created_at",
      key: "created_at",
      customRender: ({ text }: any) => getTimeByZone(text),
    },
    {
      title: getProxyT("table44"),
      dataIndex: "updated_at",
      key: "updated_at",
      customRender: ({ text }: any) => getTimeByZone(text),
    },
    {
      title: getProxyT("table23"),
      dataIndex: "admin_user",
      key: "admin_user",
    },
    { title: getProxyT("base.action"), key: "action" },
  ],
  [
    { title: getProxyT("base.index"), dataIndex: "index", key: "index" },
    { title: getProxyT("table0"), key: "userInfo" },
    {
      title: getProxyT("table53"),
      dataIndex: "portrait1",
      key: "portrait1",
    },
    {
      title: getProxyT("table54"),
      dataIndex: "verify_video",
      key: "verify_video",
    },
    { title: getProxyT("table55"), dataIndex: "status", key: "status" },
    {
      title: getProxyT("table52"),
      dataIndex: "created_at",
      key: "created_at",
      customRender: ({ text }: any) => getTimeByZone(text),
    },
    {
      title: getProxyT("table44"),
      dataIndex: "updated_at",
      key: "updated_at",
      customRender: ({ text }: any) => getTimeByZone(text),
    },
    {
      title: getProxyT("table23"),
      dataIndex: "admin_nickanme",
      key: "admin_nickanme",
    },
    { title: getProxyT("base.action"), key: "action" },
  ],
]);
export const columns = reactive<IMTableType[]>([
  ...defaultColumns[tableActiveKey.value],
]);
export const popularLevelOptions = ref<IMOptionsType[]>([]);
export const isNotShowAuthTime = ref(true);
export const isNotShowCheckedTime = ref(false);
export const isShowSpecialPopularityLevelBtn = ref(false);
export const isShowSubmitBtn = ref(true);
export const isShowRealAuthPhoto = ref(false);
export const isShowAuthProcess = ref(true);
export const isShowAuthVideo = ref(true);
export const isShowAuthInfo = ref(false);
export const isShowIdentityInfo = ref(true);
export const defaultSearchList = reactive([
  [
    {
      label: getProxyT("table0"),
      type: "input",
      model: "user",
      allowClear: true,
      placeholder: getProxyT("placeholder142"),
    },
    {
      label: getProxyT("table6"),
      type: "select",
      model: "level",
      allowClear: true,
      searchClass: "search-item-width-150",
      placeholder: getProxyT("placeholder47"),
      options: popularLevelOptions,
    },
    {
      label: getProxyT("table51"),
      type: "select",
      model: "status",
      allowClear: true,
      searchClass: "search-item-width-150",
      placeholder: getProxyT("placeholder139"),
      options: popularCertStatusMap,
    },
    {
      label: getProxyT("table52"),
      showTime: { format: "HH:mm:ss" },
      type: "rangePicker",
      model: "start_end",
      placeholder: computed(() => [$t("base.startDate"), $t("base.endDate")]),
      format: "YYYY-MM-DD HH:mm:ss",
    },
  ],
  [
    {
      label: getProxyT("table0"),
      type: "input",
      model: "user",
      allowClear: true,
      placeholder: getProxyT("placeholder142"),
    },
    {
      label: getProxyT("table55"),
      type: "select",
      model: "status",
      allowClear: true,
      searchClass: "search-item-width-150",
      placeholder: getProxyT("placeholder143"),
      options: auditStatusMap,
    },
    {
      label: getProxyT("table52"),
      showTime: { format: "HH:mm:ss" },
      type: "rangePicker",
      model: "start_end",
      placeholder: computed(() => [$t("base.startDate"), $t("base.endDate")]),
      format: "YYYY-MM-DD HH:mm:ss",
    },
    {
      label: getProxyT("table23"),
      type: "input",
      model: "admin_nickanme",
      allowClear: true,
      placeholder: getProxyT("placeholder144"),
    },
    {
      label: getProxyT("table44"),
      showTime: { format: "HH:mm:ss" },
      type: "rangePicker",
      model: "operateStart_operateEnd",
      placeholder: computed(() => [$t("base.startDate"), $t("base.endDate")]),
      format: "YYYY-MM-DD HH:mm:ss",
    },
  ],
]);
export const searchList = ref<any>(defaultSearchList[tableActiveKey.value]);
export const dicts = ref<any>({});
export const userFormState = reactive<UserFormStateType<string, Array<string>>>(
  {
    conversion: undefined,
    channel: undefined,
    mobile_area: undefined,
    mobile_number: undefined,
    country: undefined,
    last_login_time: undefined,
    created: undefined,
    sex: 1,
    age: undefined,
    birthday: undefined,
    constellation: undefined,
    height: undefined,
    weight: undefined,
    socialAccountType: undefined,
    social_account: undefined,
    friendNum: undefined,
    clubNum: undefined,
    vip_level: undefined,
    score_level: undefined,
    partyNum: undefined,
    popular_level: undefined,
    places: undefined,
    bio: undefined,
    video: undefined,
    dynamics: [],
  }
);
export const drawerFormState = reactive<any>({});
export const resetFormState = (formState) => {
  const defaultFormState = reactive<DrawerFormStateType>({
    uid: undefined,
    avatar: undefined,
    account_type: undefined,
    nickname: undefined,
    sex: undefined,
    age: undefined,
    height: undefined,
    weight: undefined,
    country: undefined,
    position: undefined,
    activeTime: undefined,
    constellation: undefined,
    income: undefined,
    occupation_cate: undefined,
    occupation_post: undefined,
    portrait1: undefined,
    portrait2: undefined,
    portrait3: undefined,
    verify_video: undefined,
    voteProgress: undefined,
    vipLevel: undefined,
    scoreLevel: undefined,
    popularLevel: undefined,
    created_at: undefined,
    educational: undefined,
    userVotes: [],
    estimate: undefined,
    status: undefined,
    editId: undefined,
    real_person_status: undefined,
    intention: undefined,
    updated_at: undefined,
    active_time: undefined,
    real_photo: undefined,
    client_avatar: undefined,
    account_picture: Array(4).fill(""),
  });
  initObjAttr(formState, defaultFormState);
};
resetFormState(drawerFormState);
export const set_formState = (type, formState, data) => {
  resetFormState(formState);
  if (type === "view") {
    Object.keys(formState).forEach((key) => (formState[key] = data[key]));
  }
};
export const intentionMap = ref<any>([]);
export const isDisplay = computed(() => {
  return (
    !!drawerFormState.verify_video ||
    !!drawerFormState.portrait1 ||
    !!drawerFormState.portrait2 ||
    !!drawerFormState.portrait3
  );
});
export const voteIconOptions = reactive<any>({
  0: "icon-shibai-yin",
  1: "icon-chenggong1",
});
export const sexIconOptions = reactive<any>({
  1: "icon-nan2",
  2: "icon-nv2",
  3: "icon-xingbie",
});

export const sexColorOptions = reactive<any>({
  1: baseStyle.blueBase,
  2: "#ff5050",
  3: "#333333",
});

export const defaultDrawerColumns = reactive([
  [
    { title: getProxyT("base.index"), dataIndex: "index", key: "index" },
    {
      title: getProxyT("table0"),
      key: "userInfo",
    },
    {
      title: getProxyT("table56"),
      dataIndex: "created_at",
      key: "created_at",
    },
    { title: getProxyT("table56"), dataIndex: "status", key: "status" },
  ],
]);
export const modalFormState = reactive<any>({
  editId: undefined,
  level: undefined,
  status: undefined,
  id: undefined,
  note: undefined,
});
export const isExpand = ref(false);
export const queryParams = reactive<any>({});
export const expandLoading = ref(false);
export const tipsObject = reactive({
  title: $t("popular9"),
  content: $t("popular10"),
});

watch([() => tabPower[0], () => tabPower[1]], (newArrayState) => {
  if (newArrayState.some((item) => item === true))
    initObjAttr(columns, defaultColumns[tableActiveKey.value]);
  if (newArrayState.every((item) => item === false)) initObjAttr(columns, []);
});
